<!--首页-->
<template>
  <div class="missyeah">
    <div
      class="missyeahbanner"
      v-for="(item, index) in adverts.index_adverts_top.items"
      :key="'adt' + index"
    >
      <a :href="item.url">
        <van-image fit="cover" class="img-fluid" :src="item.file.file_url" />
      </a>
      <ProdulistLine
        v-if="freeblock['index_banner_' + (index + 1)]"
        :productList="freeblock['index_banner_' + (index + 1)].content"
        :scollBtn="freeblock['index_banner_' + (index + 1)].content.length>4?true:false"
      />
    </div>
    <div class="product-frame">
      <div class="title-frame">
        <h1>{{ freeblock.index_goods_title.content }}</h1>
      </div>
      <ProduList :productList="freeblock.index_goods.content" />
    </div>
    <div
      class="missyeahbanner"
      v-for="(item, index) in adverts.index_adverts_bottom.items"
      :key="'adb' + index"
    >
      <a :href="item.url">
        <van-image fit="cover" class="img-fluid" :src="item.file.file_url" />
      </a>
      <ProdulistLine
        v-if="
          freeblock[
            'index_banner_' +
              (index + 1 + adverts.index_adverts_top.items.length)
          ]
        "
        :productList="
          freeblock[
            'index_banner_' +
              (index + 1 + adverts.index_adverts_top.items.length)
          ].content
        "
      />
    </div>
  </div>
</template>

<script>
import axios from "axios";
import ind from "./index.js";
export default {
  mixins: [ind.mixin],
};
</script>

<style lang="less" scoped>
.missyeah {
  overflow: hidden;
  .missyeahbanner {
    width: 100%;
    clear: both;
    overflow: hidden;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    a {
      padding: 0;
      margin: 0;
      display: flex;
      align-content: flex-start;
      align-items: flex-start;
      overflow: hidden;
    }
    .van-image {
      padding: 0;
      margin: 0;
      overflow: hidden;
      cursor: pointer;
    }
  }

  .product-frame {
    width: 100%;
    clear: both;
    margin: 0 auto;
    margin-top: 1rem;
    overflow: hidden;
    padding: 0;
    .title-frame {
      width: 100%;
      height: 6rem;
      font-size: 1.8rem;
      line-height: 6rem;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      font-family: "BTBlack" !important;
    }
  }
}
</style>
